<template>
    <div class="bar">
        <el-cascader
            style="width: 100%;"
            v-model="modelValue[itemValue]"
            :options="options"
            filterable
            clearable
        />        
    </div>
</template>

<script lang="ts" setup name="GroupedSingleSelect">
    import { onMounted, ref, watch } from "vue"

    const itemValue = ref('') // 选项名
    const props = defineProps(['modelValue', 'searchItem'])
    let options :any = ref([])
    
    onMounted(() => {
        itemValue.value = props.searchItem.value
    })

    watch(props.searchItem, (newValue:any) => {
        options.value = newValue.options
    }, {deep: true})
</script>

<style scoped>

</style>